<template>
    <div>
        <button @click="playErrorFeedback('网络请求失败，请稍后重试')">播放错误反馈</button>
    </div>
</template>

<script>
export default {
    data() {
        return {
            synth: window.speechSynthesis, // 获取浏览器的语音合成接口
            utterance: new SpeechSynthesisUtterance(), // 创建语音合成实例
        };
    },
    mounted() {
        this.initTTS(); // 初始化 TTS 配置
        if ('speechSynthesis' in window) {
            console.log('支持 Web Speech API');
        } else {
            console.error('不支持 Web Speech API');
        }
    },
    methods: {
        initTTS() {
            this.utterance.lang = 'zh-CN'; // 设置语言为中文
            this.utterance.rate = 1;       // 语速（0.1-10）
            this.utterance.pitch = 1;      // 音调（0-2）
            this.utterance.volume = 1;     // 音量（0-1）
        },
        playErrorFeedback(text) {
            if (!this.synth) return;
            this.utterance.text = text; // 动态设置要播放的文字
            this.synth.speak(this.utterance); // 播放语音
        },
        stopTTS() {
            this.synth.cancel(); // 停止当前播放
        }
    }
};
</script>